import QuestionInputConf, {QuestionInputPropsType} from "./QuestionInput";
import QuestionTitleConf, {QuestionTitlePropsType} from "./QuestionTitle";
import QuestionParagraphConf, {QuestionParagraphType} from "./QuestionParagraph";
import QuestionInfoConf, {QuestionInfoPropsType} from './QuestionInfo'
import QuestionTextareaConf, {QuestionTextareaPropType} from './QuestionTextarea'
import {FC} from "react";
import QuestionRadioConf, {QuestionRadioPropsType} from "./QuestionRadio";
import QuestionCheckboxConf, {QuestionCheckboxPropsType} from "./QuestionCheckbox";

/*整合各个组件的props*/
export type ComponentPropsType =
    QuestionInputPropsType
    & QuestionTitlePropsType
    & QuestionParagraphType
    & QuestionInfoPropsType & QuestionTextareaPropType & QuestionRadioPropsType & QuestionCheckboxPropsType
//统一组件配置
export type ComponentConfType = {
    title: string,
    type: string,
    Component: FC<ComponentPropsType>,
    defaultProps: ComponentPropsType,
    PropComponent: FC<ComponentPropsType>
}
//全部组件的配置列表
const ComponentConfList: ComponentConfType[] = [QuestionRadioConf, QuestionInputConf, QuestionTitleConf, QuestionParagraphConf, QuestionInfoConf, QuestionTextareaConf, QuestionCheckboxConf]

export const componentGroup = [
    {
        groupId: 'textGroup',
        groupName: "文本显示",
        components: [QuestionInfoConf, QuestionTitleConf, QuestionParagraphConf]
    },
    {
        groupId: 'inputGroup',
        groupName: "输入框",
        components: [QuestionTextareaConf, QuestionInputConf]
    }, {
        groupId: 'chooseGroup',
        groupName: "用户选择",
        components: [QuestionRadioConf, QuestionCheckboxConf]
    },

]

// 通过属性type找到组件的配置
/**
 * {
 *   title: string,
 *   type: string,
 *   Component: FC<ComponentPropsType>,
 *   defaultProps: ComponentPropsType,
 *   PropComponent: FC<ComponentPropsType>
 * }
 * @param type
 */
export function getComponentConByType(type: string) {
    return ComponentConfList.find(it => it.type === type)
}

